<template>
  <a-row>
    <a-col
      :span="5"
      style="border-right: 1px solid #ccc"
      :style="{ overflow: 'auto', height: windowHeight + 'px' }"
    >
      <h1 style="padding-bottom: 10px">
        组织结构
        <a-button
          size="small"
          type="primary"
          @click="showOrganizationModal"
          style="
            background: #66b1ff;
            color: #fff;
            border: none;
            margin-left: 15px;
          "
        >
          新增部门结构
        </a-button>
      </h1>
      <div style="padding: 0">
        <a-tree
          style="font-size: 18px"
          :expanded-keys="expandedKeys"
          :auto-expand-parent="autoExpandParent"
          :tree-data="treeData"
          @expand="onExpand"
        >
          <template slot="title" slot-scope="item" style="width: 100%">
            <p
              :style="tableId === item.id ? 'background-color: #dfede4;' : ''"
              @click.stop="rowTabData(item)"
              class="treeRow"
              style="display: flex; justify-content: space-between"
            >
              <span> {{ item.title }} </span>
              <span>
                <a-icon
                  style="margin-right: 5px"
                  class="treeIconBtn"
                  type="edit"
                  @click.stop="editTreeModal(item)"
                />
                <a-icon
                  v-if="item.sort != 2"
                  style="margin-right: 5px"
                  class="treeIconBtn"
                  @click.stop="addTreeModal(item)"
                  type="plus"
                />
                <a-popconfirm
                  :title="`确定要删除${item.title}这个部门吗?`"
                  ok-text="是的"
                  cancel-text="取消"
                  @confirm="delSysTeam(item)"
                >
                  <a-icon class="treeIconBtn" type="delete" />
                </a-popconfirm>
              </span>
            </p>
          </template>
        </a-tree>
      </div>
    </a-col>
    <a-col :span="19" style="border-left: 1px solid #ccc">
      <div style="padding: 24px">
        <div id="components-form-demo-advanced-search">
          <a-row :gutter="24" style="margin-bottom: 15px">
            <a-col :span="6">
              邮箱：<a-input
                :maxLength="128"
                style="width: 60%"
                v-model="searchData.emailAccount"
              />
            </a-col>
            <a-col :span="6">
              英文名：<a-input
                :maxLength="128"
                style="width: 60%"
                v-model="searchData.nickName"
              />
            </a-col>
            <a-col :span="6">
              <div>
                <a-button
                  type="primary"
                  class="searchBtn"
                  @click="
                    () => {
                      getAccTableList();
                    }
                  "
                >
                  查询
                </a-button>
                <a-button
                  style="margin: 0 10px"
                  type="primary"
                  class="searchBtn"
                  @click="resetSearch"
                >
                  重置
                </a-button>
              </div>
            </a-col>
            <a-col :span="6"> </a-col>
          </a-row>
        </div>
        <!-- //新增按钮 -->
        <div style="margin-top: 20px">
          <a-button
            type="primary"
            style="
              background: #66b1ff;
              color: #fff;
              border: none;
              margin-left: 8px;
              margin-right: 20px;
            "
            @click="addAccModal"
          >
            新增账号
          </a-button>

          <a-button
            type="primary"
            style="
              background: #66b1ff;
              color: #fff;
              border: none;
              margin-left: 8px;
              margin-right: 20px;
            "
            @click="resetSearch"
          >
            查询全部账号
          </a-button>
        </div>
      </div>
      <a-spin tip="Loading..." :spinning="spinning">
        <a-table
          :columns="columns"
          :data-source="accTabData"
          :pagination="false"
          :scroll="{ x: 1100 }"
        >
          <span slot="enableFlag" slot-scope="text, record">
            <span
              :style="record.enableFlag === 'Y' ? 'color:#3EAE7C' : 'color:red'"
            >
              {{ record.enableFlag == "Y" ? "启用" : "禁用" }}
            </span>
          </span>
          <span slot="autTime" slot-scope="text, record">
            {{
              record.autTime === null
                ? "暂无"
                : record.autTime.replace("T", " ")
            }}
          </span>
          <span slot="onlineTime" slot-scope="text, record">
            {{ record.onlineTime + "Minute" }}
          </span>
          <span slot="action" class="action" slot-scope="text, record">
            <a
              slot="action"
              href="javascript:;"
              @click="editRow(record, 'edit')"
              >编辑</a
            >
            <a-divider type="vertical" />
            <a
              slot="action"
              href="javascript:;"
              @click="editRow(record, 'editPwd')"
              >修改密码</a
            >
            <a-divider type="vertical" />
            <a
              slot="action"
              href="javascript:;"
              style="color: red; border-color: red"
              @click="delRowAcc(record)"
              >删除</a
            >
          </span>
        </a-table>
      </a-spin>
      <!-- 分页器 -->
      <div style="margin: 20px 0; text-align: center">
        <a-config-provider>
          <a-pagination
            :current="searchData.current"
            show-size-changer
            :pageSizeOptions="['10', '20', '30']"
            :show-total="
              (total) => `${$t('m.page.Total')} ${total} ${$t('m.page.items')}`
            "
            @showSizeChange="showChange"
            :buildOptionText="
              (props) =>
                ` ${props.value} ${$t('m.page.a')}/${$t('m.page.page')}`
            "
            show-quick-jumper
            :default-current="searchData.current"
            :total="total"
            @change="onChangePage"
          />
        </a-config-provider>
      </div>
    </a-col>
    <!-- 部门结构模态框 -->
    <a-modal v-model="organizationVisible" :title="organizationTitle">
      <template slot="footer" class="modelBtn">
        <a-button
          @click="organizationVisible = false"
          style="background: #d7d7d7; color: #fff; border: none"
          >取消</a-button
        >

        <a-button
          v-if="organizationTitle === '新增一级部门'"
          :loading="loading"
          type="primary"
          @click="organizationSave('add')"
          >确认</a-button
        >
        <a-button
          v-if="organizationTitle === '编辑部门'"
          :loading="loading"
          type="primary"
          @click="organizationSave('edit')"
          >确认</a-button
        >
        <a-button
          v-if="
            organizationTitle != '编辑部门' &&
            organizationTitle != '新增一级部门'
          "
          :loading="loading"
          type="primary"
          @click="organizationSave('addChild')"
          >确认</a-button
        >
      </template>
      <div style="padding: 24px; padding-bottom: 5px">
        <p style="width: 70%; margin-left: 50px">
          <span style="color: red">*</span> 部门名称：
          <a-input
            style="width: 200px"
            v-model="organizationObj.teamName"
            :maxLength="6"
          />
        </p>
      </div>
    </a-modal>

    <!-- //新增账号模态框 -->
    <a-modal
      v-model="AddAccVisible"
      :title="accflag === 'add' ? '新增账号' : '修改信息'"
      width="30%"
      :maskClosable="false"
    >
      <template slot="footer" class="modelBtn">
        <a-button
          @click="AddAccVisible = false"
          style="background: #d7d7d7; color: #fff; border: none"
          >取消</a-button
        >

        <a-button
          :loading="onSubmitLoading"
          type="primary"
          v-if="accflag === 'add'"
          @click="onSubmit('add')"
          >确认</a-button
        >
        <a-button
          :loading="onSubmitLoading"
          type="primary"
          v-if="accflag === 'edit'"
          @click="onSubmit('edit')"
          >确认</a-button
        >
        <a-button
          :loading="onSubmitLoading"
          type="primary"
          v-if="accflag === 'editPwd'"
          @click="onSubmit('editPwd')"
          >确认</a-button
        >
      </template>
      <a-form-model
        style="width: 90%; margin: 0 auto; padding: 24px"
        ref="ruleForm"
        :model="addAccForm"
        :rules="addAccRules"
        :label-col="labelCol"
        :wrapper-col="wrapperCol"
      >
        <a-form-model-item
          label="登录邮箱"
          prop="emailAccount"
          v-if="accflag != 'editPwd'"
        >
          <a-input
            :maxLength="128"
            :disabled="accflag === 'edit'"
            v-model="addAccForm.emailAccount"
          />
        </a-form-model-item>
        <a-form-model-item
          label="英文名"
          prop="nickName"
          v-if="accflag != 'editPwd'"
        >
          <a-input :maxLength="128" v-model="addAccForm.nickName" />
        </a-form-model-item>
        <a-form-model-item
          label="角色选择"
          prop="roles"
          v-if="accflag != 'editPwd'"
        >
          <a-select
            allowClear
            @change="changeRoleType"
            v-model="addAccForm.roles"
          >
            <a-select-option
              v-for="item in roleListArray"
              :key="item.roleId"
              :value="item.roleId"
              :roleType="item.roleType"
            >
              {{ item.roleName }}
            </a-select-option>
          </a-select>
        </a-form-model-item>
        <a-form-model-item
          label="仓库选择"
          prop="warehousingId"
          v-if="roleType == '3' && accflag != 'editPwd'"
        >
          <a-select allowClear v-model="addAccForm.warehousingId">
            <a-select-option
              v-for="item in warehouse"
              :key="item.warehouseId"
              :value="item.warehouseId"
            >
              {{ item.titleName }}
            </a-select-option>
          </a-select>
        </a-form-model-item>

        <a-form-model-item
          label="部门选择"
          prop="teamIds"
          v-if="accflag != 'editPwd'"
        >
          <a-cascader
            v-model="addAccForm.teamIds"
            placeholder=""
            allowClear
            :options="branchOptions"
            change-on-select
            @change="onChangeBranch"
          />
        </a-form-model-item>

        <a-form-model-item
          label="登录密码"
          prop="password"
          v-if="accflag === 'editPwd' || accflag === 'add'"
        >
          <a-input-password
            allow-clear
            autocomplete="autocomplete"
            v-model="addAccForm.password"
            type="password"
          >
            <!-- <a-icon slot="prefix" type="lock" /> -->
          </a-input-password>
        </a-form-model-item>
        <a-form-model-item
          label="确认密码"
          prop="confirmPassword"
          v-if="accflag === 'editPwd' || accflag === 'add'"
        >
          <a-input-password
            allow-clear
            autocomplete="autocomplete"
            v-model="addAccForm.confirmPassword"
            type="password"
          />
        </a-form-model-item>
        <a-form-model-item
          label="是否启用"
          prop="enableFlag"
          v-if="accflag != 'editPwd'"
        >
          <a-switch default-checked v-model="addAccForm.enableFlag" />
        </a-form-model-item>
      </a-form-model>
    </a-modal>
  </a-row>
</template>

<script>
import { mapState } from "vuex";
import {
  pageAccount_List,
  sysTeam_tree,
  add_sysTeam,
  edit_sysTeam,
  del_sysTeam,
  list_sysRole,
  add_account,
  appAccount_info,
  edit_account,
  del_account,
} from "@/apis/system/Permission/AccManagement";
import { editPwd } from "@/apis/system/acc/acc";
export default {
  created() {
    this.getSysTeamTree();
    this.getRoleLsit();
    this.getAccTableList();
  },
  data() {
    return {
      windowHeight: document.body.clientHeight, //实时屏幕高度,
      spinning: false,
      tableId: null,
      accflag: "",
      // 角色列表
      roleListArray: [],
      //部门级联选择器
      branchOptions: [],
      // 部门列表
      listTeam: [],
      //增加部门名称
      organizationTitle: "",
      //新增部门名称值
      organizationObj: {
        roleIds: [],
        teamName: null,
        teamPid: null,
        key: null,
      },
      onSubmitLoading: false,
      loading: false,
      //组织架构模态框
      organizationVisible: false,
      //新增账号模态框
      AddAccVisible: false,
      //新增账号验证规则
      addAccRules: {
        warehousingId: [
          {
            required: true,
            validator: this.validateWarehouseId,
            trigger: "blur",
          },
        ],

        emailAccount: [
          {
            required: true,
            validator: this.validateEmailAccount,
            trigger: "blur",
          },
        ],
        password: [
          {
            required: true,
            validator: this.validatePassword,
            trigger: "blur",
          },
        ],
        nickName: [
          {
            required: true,
            validator: this.validateNickName,
            trigger: "blur",
          },
        ],
        roles: [
          {
            required: true,
            validator: this.validateRoles,
            trigger: "blur",
          },
        ],
        teamIds: [
          {
            required: true,
            validator: this.validateTeamID,
            trigger: "blur",
          },
        ],
        confirmPassword: [
          {
            required: true,
            validator: this.validateConfirmPassword,
            trigger: "blur",
          },
        ],
      },
      // 新增账号数据
      addAccForm: {
        emailAccount: null,
        password: null,
        confirmPassword: null,
        roles: null,
        enableFlag: true,
        nickName: null,
        teamId: null,
        teamIds: null,
        warehousingId: null,
      },
      labelCol: { span: 6 },
      wrapperCol: { span: 18 },
      autoExpandParent: true,
      //总条数
      total: 5,
      // 账号表格数据
      accTabData: [],
      // 搜索数据
      searchData: {
        current: 1,
        size: 10,
        nickName: null,
        emailAccount: null,
        teamId: null,
      },
      //选中打开的树
      expandedKeys: [],
      treeData: [],
      sort: 0,
      rowId: null,
      roleType: "",
    };
  },
  methods: {
    //改变角色
    changeRoleType(value, option) {
      this.roleType = option.data.attrs.roleType;
    },
    //仓库角色 验证选择仓库
    validateWarehouseId(rule, value, callback) {
      if (this.roleType == "3") {
        if ((value ?? "") != "") {
          callback();
        } else {
          callback(new Error("仓库角色必须选择仓库！"));
        }
      }
    },
    // 邮箱正则验证
    validateEmailAccount(rule, value, callback) {
      const reg = /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/;
      if (this.accflag != "editPwd") {
        if (value === "" || value === undefined || value === null) {
          callback(new Error("邮箱不能为空！"));
        } else if (!reg.test(value)) {
          callback(new Error("请输入正确的邮箱格式！"));
        } else {
          callback();
        }
      } else {
        callback();
      }
    },
    // 密码验证
    validatePassword(rule, value, callback) {
      const reg = /^[a-zA-Z]\w{7,17}$/;
      if (this.accflag === "editPwd" || this.accflag === "add") {
        if (value === "" || value === undefined || value === null) {
          callback(new Error("密码不能为空！"));
        } else if (!reg.test(value)) {
          callback(
            new Error("以字母开头，长度在8~18之间，只能包含字母、数字和下划线")
          );
        } else {
          callback();
        }
      } else {
        callback();
      }
    },
    // 验证英文名
    validateNickName(rule, value, callback) {
      // const reg = /^[a-zA-Z]\w{7,17}$/;
      if (this.accflag != "editPwd") {
        if (value === "" || value === undefined || value === null) {
          callback(new Error("英文名不能为空！"));
        } else {
          callback();
        }
      } else {
        callback();
      }
    },
    // 验证角色
    validateRoles(rule, value, callback) {
      // const reg = /^[a-zA-Z]\w{7,17}$/;
      if (this.accflag != "editPwd") {
        if (value === "" || value === undefined || value === null) {
          callback(new Error("角色不能为空！"));
        } else {
          callback();
        }
      } else {
        callback();
      }
    },
    // 验证部门
    validateTeamID(rule, value, callback) {
      // const reg = /^[a-zA-Z]\w{7,17}$/;
      if (this.accflag != "editPwd") {
        if (
          value === "" ||
          value === undefined ||
          value === null ||
          value.length <= 0
        ) {
          callback(new Error("部门不能为空！"));
        } else {
          callback();
        }
      } else {
        callback();
      }
    },
    //验证二次密码
    validateConfirmPassword(rule, value, callback) {
      if (this.accflag === "editPwd" || this.accflag === "add") {
        if (value === "" || value === undefined || value === null) {
          callback(new Error("请输入确认密码！"));
        } else if (value != this.addAccForm.password) {
          callback(new Error("两次密码输入不一致，请检查密码！"));
        } else {
          callback();
        }
      } else {
        callback();
      }
    },
    //新增账号部门联机选择器
    onChangeBranch(value) {
      this.addAccForm.teamId = value[value.length - 1];
    },
    //保存组织架构
    organizationSave(flag) {
      this.loading = true;
      if (
        this.organizationObj.teamName === null ||
        this.organizationObj.teamName === ""
      ) {
        this.$message.error("部门名称为必填项！");
        this.loading = false;
        return false;
      }
      if (flag === "add") {
        setTimeout(async () => {
          let { code, message } = await add_sysTeam({
            roleIds: [],
            teamName: this.organizationObj.teamName,
            teamPid: null,
          });

          if (code === "10000") {
            this.loading = false;
            this.organizationVisible = false;
            this.getSysTeamTree();
          } else {
            this.$message.error(message);
            this.loading = false;
          }
        }, 1000);
      } else if (flag === "edit") {
        setTimeout(async () => {
          this.organizationObj.id = this.organizationObj.key;
          let { code, message } = await edit_sysTeam(this.organizationObj);
          if (code === "10000") {
            this.loading = false;
            this.organizationVisible = false;
            this.getSysTeamTree();
          } else {
            this.$message.error(message);
            this.loading = false;
          }
        }, 1000);
      } else if (flag === "addChild") {
        setTimeout(async () => {
          let { code, message } = await add_sysTeam(this.organizationObj);
          if (code === "10000") {
            this.loading = false;
            this.organizationVisible = false;
            this.getSysTeamTree();
          } else {
            this.$message.error(message);
            this.loading = false;
          }
        }, 1000);
      }
    },
    //   编辑按钮
    async editRow(record, flag) {
      if (this.$refs.ruleForm) {
        this.$refs.ruleForm.resetFields();
      }
      this.accflag = flag;
      if (flag === "edit") {
        let { code, responseBody } = await appAccount_info(record.id);
        if (code === "200") {
          this.addAccForm.teamId = responseBody.teamId;
          this.addAccForm.teamIds = responseBody.teamIds.split(",");
          this.addAccForm.emailAccount = responseBody.emailAccount;
          this.addAccForm.nickName = responseBody.nickName;
          this.addAccForm.roles = responseBody.roles;
          this.addAccForm.id = responseBody.id;
          this.addAccForm.warehousingId = responseBody.warehousingId;
          this.addAccForm.enableFlag =
            responseBody.enableFlag == "Y" ? true : false;
          this.AddAccVisible = true;
          this.roleType = responseBody.type;
        }
      } else if (flag === "editPwd") {
        this.addAccForm = {
          emailAccount: null,
          password: null,
          confirmPassword: null,
          roles: null,
          enableFlag: true,
          nickName: null,
          teamId: null,
          teamIds: null,
          warehousingId: null,
        };
        this.rowId = record.id;
        this.AddAccVisible = true;
      }
    },
    //删除每一行账号
    delRowAcc(record) {
      let _this = this;
      this.$confirm({
        title: "确定要删除邮箱为" + record.emailAccount + "的账号吗?",
        cancelText: "取消",
        okText: "确定",
        onOk() {
          return new Promise((resolve) => {
            setTimeout(async () => {
              let { code, message } = await del_account(record.id);
              if (code === "10000") {
                _this.getAccTableList();
                resolve();
              } else {
                resolve();
                _this.$message.error(message);
              }
            });
          }, 1000).catch(() => console.log("Oops errors!"));
        },
        onCancel() {},
      });
    },
    //树形部门删除
    async delSysTeam(item) {
      let { code } = await del_sysTeam(item.id);
      if (code === "10000") {
        this.getSysTeamTree();
      }
    },
    // 每一行权限配置
    editRowPower(record) {
      setTimeout(() => {
        this.$bus.$emit("PowerManagement", record);
      }, 1);
    },
    //新增账号按钮
    onSubmit(flag) {
      this.onSubmitLoading = true;
      let sumitData = { ...this.addAccForm };
      if (sumitData.teamIds != null) {
        sumitData.teamIds = sumitData.teamIds.join(",");
      }
      if (this.addAccForm.enableFlag) {
        sumitData.enableFlag = "Y";
      } else {
        sumitData.enableFlag = "N";
      }
      this.$refs.ruleForm.validate((valid) => {
        if (valid) {
          // base64加密
          // for (let i = 0; i < 5; i++) {
          //   sumitData.pwd = Base64.encode(sumitData.pwd);
          // }
          if (flag === "add") {
            setTimeout(async () => {
              let { code } = await add_account(sumitData);
              if (code === "10000") {
                this.onSubmitLoading = false;
                this.getAccTableList();
                this.AddAccVisible = false;
              } else {
                // this.$message.error(message);
                this.onSubmitLoading = false;
              }
            }, 1000);
          } else if (flag === "edit") {
            setTimeout(async () => {
              let { code } = await edit_account(sumitData);
              if (code === "10000") {
                this.onSubmitLoading = false;
                this.getAccTableList();
                this.AddAccVisible = false;
              } else {
                this.onSubmitLoading = false;
              }
            });
          } else if (flag === "editPwd") {
            setTimeout(async () => {
              let { code } = await editPwd({
                id: this.rowId,
                password: this.addAccForm.password,
              });
              if (code === "10000") {
                this.AddAccVisible = false;
                this.getAccTableList();
                this.onSubmitLoading = false;
              } else {
                // this.$message.error(message);
              }
            }, 1000);
          }
        } else {
          this.onSubmitLoading = false;
          return false;
        }
      });
    },
    //重置按钮
    resetSearch() {
      this.searchData.emailAccount = null;
      this.searchData.nickName = null;
      this.searchData.teamId = null;
      this.tableId = null;
      this.getAccTableList();
    },
    //新增账号模态框
    addAccModal() {
      if (this.$refs.ruleForm) {
        this.$refs.ruleForm.resetFields();
      }
      this.AddAccVisible = true;
      this.accflag = "add";
      for (let key in this.addAccForm) {
        this.addAccForm[key] = null;
      }
      this.addAccForm.teamIds = [];
      this.addAccForm.enableFlag = true;
    },
    //树形编辑
    editTreeModal(item) {
      this.organizationObj.teamPid = item.parentId;
      this.organizationObj.key = item.id;
      this.organizationObj.teamName = item.teamName;
      this.organizationVisible = true;
      this.organizationTitle = "编辑部门";
    },
    //添加部门模态框显示
    showOrganizationModal() {
      this.organizationTitle = "新增一级部门";
      this.organizationObj.teamName = null;
      this.organizationObj.id = null;
      this.organizationObj.key = null;
      this.organizationVisible = true;
    },
    //新增二级-三级部门
    addTreeModal(item) {
      this.organizationObj.teamName = null;
      this.organizationObj.teamPid = item.id;
      this.organizationTitle = item.title;
      this.organizationTitle = `为${this.organizationTitle}新增部门`;
      this.organizationVisible = true;
    },
    //分页器事件
    onChangePage(pageNumber) {
      this.searchData.current = pageNumber;
      this.getAccTableList();
    },
    //页码变更
    showChange(size, current) {
      this.searchData.current = size;
      this.searchData.size = current;
      this.getAccTableList();
    },
    // 树形打开
    onExpand(expandedKeys) {
      this.expandedKeys = expandedKeys;
      this.autoExpandParent = false;
    },
    filterOption(input, option) {
      return (
        option.componentOptions.children[0].text
          .toLowerCase()
          .indexOf(input.toLowerCase()) >= 0
      );
    },
    //获取部门权限树
    async getSysTeamTree() {
      let { code, responseBody } = await sysTeam_tree();
      if (code === "200") {
        this.treeData = this.resetTree(responseBody);
        this.branchOptions = this.resetBranchTree(responseBody);
        // this.searchData.teamId =
        //   this.tableId === null ? this.treeData[0].id : this.tableId;
      }
    },
    //重构树
    resetTree(data) {
      data.forEach((item) => {
        item.title = item.teamName;
        item.scopedSlots = { title: "title" };
        item.sort = this.sort;
        item.key = item.id;
        if (item.children && item.children.length >= 1) {
          this.sort += 1;
          this.resetTree(item.children);
        }
      });
      this.sort = 0;
      return data;
    },
    //重构级联树
    resetBranchTree(data) {
      data.forEach((item) => {
        item.label = item.teamName;
        item.value = item.id;
        if (item.children && item.children.length >= 1) {
          this.resetBranchTree(item.children);
        }
      });
      return data;
    },
    // 获取角色树
    async getRoleLsit() {
      let { code, responseBody } = await list_sysRole();
      if (code === "200") {
        this.roleListArray = responseBody;
      }
    },
    //点击每一行获取右侧表数据
    rowTabData(rowData) {
      this.tableId = rowData.id;
      this.searchData.teamId = rowData.id;
      this.getAccTableList();
    },
    //获取表格账号数据
    async getAccTableList() {
      this.spinning = true;
      let { code, responseBody } = await pageAccount_List(this.searchData);
      if (code === "200") {
        responseBody.records.forEach((item) => {
          item.key = item.id;
        });

        this.total = responseBody.total * 1;
        this.accTabData = responseBody.records;
        this.spinning = false;
      }
    },
  },
  computed: {
    ...mapState(["warehouse"]),
    columns() {
      return [
        {
          title: "邮箱",
          dataIndex: "emailAccount",
          align: "center",
          width: "15%",
        },
        {
          title: "英文名",
          dataIndex: "nickName",
          align: "center",
          width: "13%",
        },
        {
          title: "所属部门",
          dataIndex: "teamName",
          align: "center",
          width: "10%",
        },
        {
          title: "角色名称",
          dataIndex: "roles",
          align: "center",
          width: "12%",
        },
        {
          title: "状态",
          dataIndex: "enableFlag",
          scopedSlots: { customRender: "enableFlag" },
          align: "center",
          width: "9%",
        },
        {
          title: "登录时间",
          dataIndex: "autTime",
          scopedSlots: { customRender: "autTime" },
          align: "center",
          width: "12%",
        },
        {
          title: "在线时长",
          dataIndex: "onlineTime",
          scopedSlots: { customRender: "onlineTime" },
          align: "center",
          width: "12%",
        },
        {
          title: "操作",
          dataIndex: "action",
          scopedSlots: { customRender: "action" },
          align: "center",
          width: 200,
          fixed: "right",
        },
      ];
    },
  },
};
</script>

<style lang="less" scoped>
/deep/.ant-tree li .ant-tree-node-content-wrapper {
  width: 90%;
}

.treeIconBtn {
  display: none;
}
.treeRow:hover .treeIconBtn {
  display: inline-block;
}
/deep/.ant-modal-body {
  padding: 0;
}
.searchBtn {
  background: #fff;
  color: #3eae7c;
  text-shadow: none;
}
.searchBtn:hover {
  background: #3eae7c;
  color: #fff;
}
.action {
  a {
    border-bottom: 1px solid rgb(41, 41, 224);
    color: rgb(41, 41, 224);
  }
}
</style>